import 'package:flutter/material.dart';
import 'package:densefog/arrow_painter.dart';
import 'package:densefog/block_item.dart';
import 'package:densefog/const.dart';

class BlockItemWidget extends StatelessWidget {
  final BlockItem item;
  final LinearGradient gradient;

  const BlockItemWidget({
    Key? key,
    required this.item,
    required this.gradient,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return DecoratedBox(
      decoration: BoxDecoration(
        borderRadius: const BorderRadius.all(Radius.circular(borderRadius)),
        gradient: gradient,
        boxShadow: boxShadow1,
      ),
      child: Padding(
        padding: const EdgeInsets.only(
          bottom: cellSize * 0.2,
        ),
        child: Stack(
          children: [
            DecoratedBox(
              decoration: BoxDecoration(
                borderRadius: const BorderRadius.all(
                  Radius.circular(borderRadius - 2.0),
                ),
                gradient: gradient,
                boxShadow: boxShadow2,
              ),
              child: const Center(child: SizedBox()),
            ),
            DecoratedBox(
              decoration: BoxDecoration(
                borderRadius: const BorderRadius.all(
                  Radius.circular(borderRadius),
                ),
                gradient: LinearGradient(
                  colors: const [
                    Colors.transparent,
                    Colors.white30,
                  ],
                  stops: (item.height > item.width || item.isMainPosition)
                      ? [0.995, 0.7]
                      : [0.99, 0.7],
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                ),
              ),
              child: item.isMainPosition
                  ? const Center(
                      child: ClipPath(
                        child: RepaintBoundary(
                          child: SizedBox(
                            height: cellSize,
                            width: cellSize,
                            child: RotatedBox(
                              quarterTurns: 1,
                              child: CustomPaint(
                                willChange: false,
                                isComplex: true,
                                painter: ArrowPainter(
                                  arrowColor: Colors.white30,
                                ),
                              ),
                            ),
                          ),
                        ),
                      ),
                    )
                  : const Center(child: SizedBox()),
            ),
          ],
        ),
      ),
    );
  }
}

const boxShadow1 = [
  BoxShadow(
    color: Colors.black,
    blurRadius: 9.0,
    spreadRadius: -5.0,
    offset: Offset(0, 10),
  ),
];

const boxShadow2 = [
  BoxShadow(
    color: Color(0x99000000),
    blurRadius: 10.0,
    spreadRadius: 0.0,
    offset: Offset(0, 20),
  ),
];
